@import "tailwindcss";

@layer base {
  html {
    @apply antialiased;
  }

  body {
    @apply bg-gray-50 text-gray-900;
  }
}

@layer components {
  .container {
    @apply max-w-7xl mx-auto px-4 sm:px-6 lg:px-8;
  }
}

.markdown-body {
  @apply text-gray-800;
}

.markdown-body h1 {
  @apply text-2xl lg:text-3xl font-bold mt-8 mb-4;
}

.markdown-body h2 {
  @apply text-xl lg:text-2xl font-bold mt-6 mb-3;
}

.markdown-body h3 {
  @apply text-lg lg:text-xl font-bold mt-5 mb-2;
}

.markdown-body p {
  @apply my-4 leading-relaxed;
}

.markdown-body ul {
  @apply list-disc pl-6 my-4;
}

.markdown-body ol {
  @apply list-decimal pl-6 my-4;
}

.markdown-body li {
  @apply my-1;
}

.markdown-body code {
  @apply bg-gray-100 px-1 py-0.5 rounded text-sm font-mono;
}

.markdown-body pre code {
  @apply bg-transparent p-0;
}

.markdown-body blockquote {
  @apply border-l-4 border-gray-300 pl-4 my-4 italic;
}

.markdown-body a {
  @apply text-blue-600 hover:text-blue-800 underline;
}

.markdown-body table {
  @apply w-full border-collapse my-4 overflow-x-auto block;
}

.markdown-body th {
  @apply border border-gray-300 px-2 lg:px-4 py-2 bg-gray-100;
}

.markdown-body td {
  @apply border border-gray-300 px-2 lg:px-4 py-2;
}

.markdown-body img {
  @apply max-w-full h-auto my-4 rounded;
}

.markdown-body hr {
  @apply my-8 border-t border-gray-300;
}

/* 移动端适配 */
@media (max-width: 768px) {
  .markdown-body pre {
    @apply text-sm;
  }

  .markdown-body table {
    @apply text-sm;
  }

  .markdown-body blockquote {
    @apply text-sm;
  }
}

/* 代码高亮主题自定义 */
.hljs {
  @apply rounded-lg;
}

/* 滚动条样式 */
::-webkit-scrollbar {
  @apply w-2;
}

::-webkit-scrollbar-track {
  @apply bg-gray-100;
}

::-webkit-scrollbar-thumb {
  @apply bg-gray-300 rounded-full hover:bg-gray-400;
}

@font-face {
  font-family: 'hotTop';
  src: url('/public/fonts/字魂霸燃手书\(商用需授权\).ttf') format('truetype');
}